@import '~scss/variables';

.versionSelect {
  margin-bottom: 32px;
  > h3 {
    margin-bottom: 12px;
    line-height: 20px;
    font-size: $size-normal;
    font-weight: bold;
    color: $text-color;
  }

  :global {
    .is-open {
      .select-arrow-zone {
        transform: rotateX(180deg);
      }
    }
  }

  .select {
    width: 100%;
    :global {
      .select-control {
        height: 60px;
        padding: 10px 0;

        .select-input > input {
          width: 0 !important;
        }
      }

      .select-menu-outer {
        .select-menu {
          background-color: $white;
        }

        .select-option {
          height: 50px;
          background-color: $white;
          font-weight: normal;
          cursor: pointer;

          &:hover {
            background-color: $card-bg-color;
          }
        }
      }
    }

    .icon {
      margin: 10px;
    }

    .versionOption,
    .versionValue {
      line-height: 20px;

      .name {
        color: $text-color;
        font-weight: bold;
      }

      .time {
        color: $second-text-color;
        font-weight: normal;
      }
    }

    .versionValue {
      height: 60px;
      padding: 10px 0;
    }
  }
}
